<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  </head>
  <body>
    <p>文章列表</p>
    <ul>
      <% items.forEach(function(item){%>
      <li><%=item.title %></li>
      <% }) %>
    </ul>
    <button id="1">
      添加
    </button>
    <button id="2">
      删除
    </button>
    <button id="3">
      修改
    </button>
    <button id="4">
      查询
    </button>
  </body>
  <script>
    $('#1').click(function() {
      $.ajax({
        url: '/posts/add',
        success: () => {
          window.location.reload();
        },
      });
    });
    $('#2').click(function() {
      $.ajax({
        url: '/posts/del',
        success: () => {
          window.location.reload();
        },
      });
    });
    $('#3').click(function() {
      $.ajax({
        url: '/posts/mod',
        success: () => {
          window.location.reload();
        },
      });
    });
    $('#4').click(function() {
      $.ajax({
        url: '/posts/find',
        success: res => {
          console.log(res);
        },
      });
    });
  </script>
</html>
